<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title>公告管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/iconfont.css">
    <link rel="stylesheet" href="../lib/layui/css/layui.css" media="all">

    <link rel="stylesheet" href="../css/xadmin.css">
    <script src="../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/xadmin.js"></script>
    <script src="../js/base.js"></script>
    <style>
        tr td,
        tr th {
            text-align: center !important;
            border: none !important;
        }

        tr td {
            border-bottom: 1px solid #eee !important;
            border-top: 1px solid #eee !important;
        }
    </style>
</head>

<body>
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card" style="display: flex;justify-content: space-between;">
                    <div class="layui-card-body ">
                        <blockquote class="layui-elem-quote" style="border:0;font-size: 18px;color: #000;">公告管理
                        </blockquote>
                    </div>
                </div>
            </div>
            <div class="layui-col-md12">
                <div class="layui-card">
                    <!-- <div class="layui-card-header">数据统计</div> -->
                    <div class="layui-fluid">
                        <div class="layui-row layui-col-space15">
                            <div class="layui-col-md12">
                                <div class="layui-card-body ">
                                    <blockquote class="layui-elem-quote"
                                        style="border:0;font-size: 20px;color: #000;">消息管理列表
                                    </blockquote>
                                    <!-- <div class="layui-tab" lay-filter="tab1">
                                        <ul class="layui-tab-title">
                                          <li class="layui-this">站内消息</li>
                                           <li>短信消息</li>
                                        </ul>
                                        <div class="layui-tab-content"> -->
                                            <!-- <div class="layui-tab-item layui-show"> -->
                                                <!-- <div class="layui-card-body layui-table-body layui-table-main"> -->
                                                    <div style="cursor: pointer" class="layui-btn layui-btn-primary"
                                                        onclick="xadmin.open('新增消息','add_annouse.html',600,360)">新增消息<i
                                                            class="layui-icon">&#xe654;</i>
                                                    </div>
                                                    
                                                    <table id="annoucement_table" lay-filter="test" lay-data="{id: 'annouceReload'}"></table>
                                                    <script type="text/html" id="barDemo">
                                                        <a lay-event="detail" class="btn_a layui-btn layui-btn-primary layui-btn-xs">查看</a>
                                                        <a lay-event="edit" class="btn_a layui-btn layui-btn-xs">修改</a>
                                                        <a lay-event="send" class="btn_a layui-btn layui-btn-xs">发送消息</a>
                                                        <a lay-event="del" class="btn_a layui-btn layui-btn-danger layui-btn-xs">删除</a>
                                                    </script>
                                                    
                                                <!-- </div> -->
                                            <!-- </div> -->
                                            <!-- <div class="layui-tab-item">
                                                <div class="layui-card-body layui-table-body layui-table-main">
                                                    <div style="cursor: pointer" class="layui-btn layui-btn-primary"
                                                        onclick="xadmin.open('新增短消息','add_shortMsg.html',600,360)">新增短信消息<i
                                                            class="layui-icon">&#xe654;</i>
                                                    </div>
                                                    
                                                    <table id="annoucement_table_short" lay-filter="test" lay-data="{id: 'shortTemplateTab'}"></table>
                                                    <script type="text/html" id="barDemo2">
                                                        <a lay-event="detail_short" class="btn_a layui-btn layui-btn-primary layui-btn-xs">查看</a>
                                                        <a lay-event="edit_short" class="btn_a layui-btn layui-btn-xs">修改</a>
                                                        <a lay-event="send_short" class="btn_a layui-btn layui-btn-xs">发送消息</a>
                                                        <a lay-event="del_short" class="btn_a layui-btn layui-btn-danger layui-btn-xs">删除</a>
                                                    </script>
                                                    
                                                </div>
                                            </div> -->
                                        <!-- </div>
                                    </div> -->
                                </div>
                            </div>
                            <div class="layui-col-md12">
                                <div class="layui-card-body ">
                                    <blockquote class="layui-elem-quote"
                                        style="border:0;font-size: 20px;color: #000;">消息发送记录
                                    </blockquote>
                                    <div class="layui-card-body layui-table-body layui-table-main">
                                        <!-- <div class="layui-tab" lay-filter="tab2">
                                            <ul class="layui-tab-title">
                                              <li class="layui-this">站内消息</li>
                                              <li>短信消息</li>
                                            </ul>
                                            <div class="layui-tab-content">
                                                <div class="layui-tab-item layui-show"> -->
                                                    <!-- 表格部分开始 -->
                                                    <table id="annoucement_record_table" lay-filter="test" lay-data="{id: 'record_table'}"></table>
                                                    <script type="text/html" id="barDemo1">
                                                        <a lay-event="delRecord" class="btn_a layui-btn layui-btn-danger layui-btn-xs">删除</a>
                                                    </script>
                                                    <!-- 表格结束 -->
                                                <!-- </div> -->
                                                <!-- <div class="layui-tab-item">       
                                                    <table id="annoucement_record_table_short" lay-filter="test" lay-data="{id: 'record_table_short'}"></table>
                                                    <script type="text/html" id="barDemo3">
                                                        <a lay-event="delRecord_short" class="btn_a layui-btn layui-btn-danger layui-btn-xs">删除</a>
                                                    </script>
                                                    
                                                </div>
                                            </div>
                                        </div> -->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
    </div>
</body>

</html>

<script>
    layui.use(['table','element'], function () {
        var table = layui.table;
        var form = layui.form;
        var element = layui.element;
        var index = layer.load(1);


        //站内消息,消息模板表格渲染
        var ins1 = table.render({
            elem: '#annoucement_table',//指定原始表格元素选择器（推荐id选择器）
            width: "100%",
            loading: true,
            method: 'get',
            url: templateList, //数据接口
            page: true,//开启分页
            cols: [[ //表头
                { field: 'title', title: '消息标题', width: 200 },
                { field: 'content', title: '消息内容', width: 600 },
                { field: 'addTime', title: '创建时间', width: 180 },
                { fixed: 'right', title: "操作", width: 400, align: 'center', toolbar: '#barDemo' }
            ]],
            id: "annouceReload",
            done: function (res) {
                layer.close(index)
                if (res.msg == "2") {
                    parent.window.location.href = getRequestPrefix() + "/carAdmin/login.html"
                }
            }
        });
        // // 短信消息，消息模板
        // var ins2 = table.render({
        //     elem: '#annoucement_table_short',//指定原始表格元素选择器（推荐id选择器）
        //     width: "100%",
        //     loading: true,
        //     method: 'get',
        //     url: templateListShort, //数据接口
        //     page: true,//开启分页
        //     cols: [[ //表头
        //         { field: 'title', title: '消息标题', width: 200 },
        //         { field: 'content', title: '消息内容', width: 600 },
        //         { field: 'addTime', title: '创建时间', width: 180 },
        //         { fixed: 'right', title: "操作", width: 400, align: 'center', toolbar: '#barDemo2' }
        //     ]],
        //     id: "shortTemplateTab",
        //     done: function (res) {
        //         layer.close(index)
        //         if (res.msg == "2") {
        //             parent.window.location.href = getRequestPrefix() + "/carAdmin/login.html"
        //         }
        //     }
        // });

        // // 监听消息模板tab页点击切换
        // element.on('tab(tab1)', function(data){
        //     // console.log(data);
        //     if(data.index == 0){
        //         table.reload('annouceReload', {
        //             page: {
        //                 curr: 1 //重新从第 1 页开始
        //             }
        //         }, 'data');
        //     } else {
        //         table.reload('shortTemplateTab', {
        //             page: {
        //                 curr: 1 //重新从第 1 页开始
        //             }
        //         }, 'data');
        //     }
        // });

        // 站内消息，消息发送记录列表
        table.render({
            elem: '#annoucement_record_table',//指定原始表格元素选择器（推荐id选择器）
            width: "100%",
            loading: true,
            method: 'get',
            url: msgRecord, //数据接口
            page: true,//开启分页
            // toolbar: 'default', //开启工具栏，此处显示默认图标
            cols: [[ //表头
                { field: 'title', title: '消息标题', width: 300 },
                { field: 'content', title: '消息内容', width: 700 },
                { field: 'userName', title: '消息接收人', width: 150, },
                { field: 'addTime', title: '创建时间', width: 180 },
                { fixed: 'right', title: "操作", width: 130, align: 'center', toolbar: '#barDemo1' }
            ]],
            id: "msg_record_reload",
            done: function (res) {
                layer.close(index)
                if (res.msg == "2") {
                    parent.window.location.href = getRequestPrefix() + "/carAdmin/login.html"
                }
            }
        });

        // // 短信消息，消息发送记录列表
        // table.render({
        //     elem: '#annoucement_record_table_short',//指定原始表格元素选择器（推荐id选择器）
        //     width: "100%",
        //     loading: true,
        //     method: 'get',
        //     url: msgRecordsShort, //数据接口
        //     page: true,//开启分页
        //     cols: [[ //表头
        //         { field: 'title', title: '消息标题', width: 300 },
        //         { field: 'content', title: '消息内容', width: 700 },
        //         { field: 'userName', title: '消息接收人', width: 150, },
        //         { field: 'addTime', title: '创建时间', width: 180 },
        //         { fixed: 'right', title: "操作", width: 130, align: 'center', toolbar: '#barDemo3' }
        //     ]],
        //     id: "record_table_short",
        //     done: function (res) {
        //         layer.close(index)
        //         if (res.msg == "2") {
        //             parent.window.location.href = getRequestPrefix() + "/carAdmin/login.html"
        //         }
        //     }
        // });

        // // 监听消息发送记录列表的tab页点击切换
        // element.on('tab(tab2)', function(data){
        //     // console.log(data);
        //     if(data.index == 0){
        //         table.reload('msg_record_reload', {
        //             page: {
        //                 curr: 1 //重新从第 1 页开始
        //             }
        //         }, 'data');
        //     } else {
        //         table.reload('record_table_short', {
        //             page: {
        //                 curr: 1 //重新从第 1 页开始
        //             }
        //         }, 'data');
        //     }
        // });



        //监听点击的按钮，获取行信息
        table.on('tool(test)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            //获得当前行数据
            var $ = layui.$
            var data = obj.data, layEvent = obj.event; //获得 lay-event 对应的值
            if (layEvent === 'detail') {
                // 查看站内消息详情
                layer.open({
                    content: "annouseInfo.html",
                    type: 2,
                    area: ["600px", "330px"],
                    title: "站内消息详情",
                    // shade:true,
                    shadeClose: true,
                    success: function (layero, index) {
                        var body = layer.getChildFrame('body', index);
                        var iframeWin = window[layero.find('iframe')[0]['name']];
                        body.find('.title').text(data.title)
                        body.find('.content').text(data.content)
                        body.find('.userName').text(data.userName)
                        body.find('.addTime').text(data.addTime)
                    }
                })
            }else if(layEvent === 'detail_short'){
                // 查看短信消息详情
                layer.open({
                    content: "shortMsgInfo.html",
                    type: 2,
                    area: ["600px", "330px"],
                    title: "短消息详情",
                    // shade:true,
                    shadeClose: true,
                    success: function (layero, index) {
                        // console.log(data)//获取点击行的数据
                        var body = layer.getChildFrame('body', index);
                        var iframeWin = window[layero.find('iframe')[0]['name']];
                        body.find('.title').text(data.title)
                        body.find('.content').text(data.content)
                        body.find('.userName').text(data.userName)
                        body.find('.addTime').text(data.addTime)
                    }
                })
            } else if (layEvent === "edit") {
                // 修改站内消息
                layer.open({
                    content: "annouse_edit.html",
                    type: 2,//打开的窗口的类型
                    area: ["600px", "360px"],
                    title: "站内消息修改",
                    shadeClose: true,
                    success: function (layero, index) {
                        // console.log(data)//获取点击行的数据,获取打开的iframe
                        var body = layer.getChildFrame('body', index);
                        var iframeWin = window[layero.find('iframe')[0]['name']];
                        //行信息数据回显
                        body.find('#title').val(data.title)
                        body.find('#content').val(data.content)
                        body.find('.confirm').attr("index", data.id)
                    }
                })
            }else if (layEvent === "edit_short") {
                // 修改短消息模板
                layer.open({
                    content: "edit_shortMsg.html",
                    type: 2,//打开的窗口的类型
                    area: ["600px", "360px"],
                    title: "短消息修改",
                    shadeClose: true,
                    success: function (layero, index) {
                        // console.log(data)//获取点击行的数据,获取打开的iframe
                        var body = layer.getChildFrame('body', index);
                        var iframeWin = window[layero.find('iframe')[0]['name']];
                        //行信息数据回显
                        body.find('#title').val(data.title)
                        body.find('#content').val(data.content)
                        body.find('.confirm').attr("index", data.id)
                    }
                })
            } else if (layEvent === "del") {
                // 站内消息删除
                layer.confirm('确认删除此条记录吗？', function (index) {//点击确定后，才执行下面语句
                    $.ajax({
                        type: "get",
                        url: delAnnouse,
                        data: {
                            id: data.id
                        },
                        success: function (res) {
                            // console.log(res,"2da42da2ad12ad42da4")
                            if (res.msg == 0) {
                                //删除成功
                                layer.close(index);
                                // console.log(index, data);//获取行信息
                                obj.del(); //删除对应行（tr）的DOM结构
                                table.reload('annouceReload', {
                                    page: {
                                        curr: 1 //重新从第 1 页开始
                                    }
                                }, 'data');
                            } else {
                                layer.msg(res.msg)
                            }
                        }
                    })

                    //向服务端发送删除指令
                });
            } else if (layEvent === "del_short") {
                // 短消息模板消息删除
                layer.confirm('确认删除此条记录吗？', function (index) {//点击确定后，才执行下面语句
                    $.ajax({
                        type: "get",
                        url: delAnnouse,
                        data: {
                            id: data.id
                        },
                        success: function (res) {
                            // console.log(res,"2da42da2ad12ad42da4")
                            if (res.msg == 0) {
                                //删除成功
                                layer.close(index);
                                // console.log(index, data);//获取行信息
                                obj.del(); //删除对应行（tr）的DOM结构
                                table.reload('shortTemplateTab', {
                                    page: {
                                        curr: 1 //重新从第 1 页开始
                                    }
                                }, 'data');
                            } else {
                                layer.msg(res.msg)
                            }
                        }
                    })

                    //向服务端发送删除指令
                });
            } else if (layEvent === "send") {
                // 站内消息发送
                layer.open({
                    type: 2,
                    title: "发送站内消息",
                    content: "sendMsg.html",
                    area: ["1000px", "600px"],
                    success: function (layero, index) {
                        console.log("打开成功", data)
                        var body = layer.getChildFrame('body', index);
                        var iframeWin = window[layero.find('iframe')[0]['name']];

                        body.find(".biaoti").html(data.title)
                        body.find(".neirong").html(data.content)
                        body.find(".send1").attr("index", data.id)
                    }
                })
            } else if (layEvent === "send_short") {
                // 短消息发送
                layer.open({
                    type: 2,
                    title: "发送短信消息",
                    content: "sendShortMsg.html",
                    area: ["1000px", "600px"],
                    success: function (layero, index) {
                        console.log("打开成功", data)
                        var body = layer.getChildFrame('body', index);
                        var iframeWin = window[layero.find('iframe')[0]['name']];

                        body.find(".biaoti").html(data.title)
                        body.find(".neirong").html(data.content)
                        body.find(".send1").attr("index", data.id)
                    }
                })
            } else if (layEvent === "delRecord") {
                // 删除站内消息记录
                layer.confirm('确认删除此条记录吗？', function (index) {//点击确定后，才执行下面语句
                    $.ajax({
                        type: "get",
                        url: delMsgRecord,
                        data: {
                            id: data.id
                        },
                        success: function (res) {
                            if (res.msg == 0) {
                                //删除成功
                                layer.close(index);
                                obj.del(); //删除对应行（tr）的DOM结构
                                table.reload('msg_record_reload', {
                                    page: {
                                        curr: 1 //重新从第 1 页开始
                                    }
                                }, 'data');
                            } else {
                                layer.msg(res.msg)
                            }
                        }
                    })
                });
            } else if (layEvent === "delRecord_short") {
                // 删除短信消息记录
                layer.confirm('确认删除此条记录吗？', function (index) {//点击确定后，才执行下面语句
                    $.ajax({
                        type: "get",
                        url: delMsgRecord,
                        data: {
                            id: data.id
                        },
                        success: function (res) {
                            if (res.msg == 0) {
                                //删除成功
                                layer.close(index);
                                obj.del(); //删除对应行（tr）的DOM结构
                                table.reload('msg_record_reload_short', {
                                    page: {
                                        curr: 1 //重新从第 1 页开始
                                    }
                                }, 'data');
                            } else {
                                layer.msg(res.msg)
                            }
                        }
                    })
                });
            }
        });



    });
</script>